<!DOCTYPE html>
<html style="height: 100%;">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>ZipPlayer</title>

    <link href="/web-container-base/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="/web-container-base/plugins/bootstrapQ/qiao.css" rel="stylesheet">
    <link href="/web-container-base/plugins/zTree/css/metroStyle/standardStyle.css" rel="stylesheet" id="zTreeCss">
    <style type="text/css">
        /* 调整zTree每行的高度 */
        .ztree li a {
            /*height: 25px !important;*/
            width: 95% !important;
        }

        .ztree li .caret {
            margin-top: 8px !important;
        }
    </style>

    <script type="text/javascript" src="/web-container-base/plugins/scripts/jquery.min.js"></script>
    <script type="text/javascript" src="/web-container-base/plugins/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/web-container-base/plugins/bootstrapQ/qiao.js"></script>
    <script type="text/javascript" src="/web-container-base/plugins/zTree/js/jquery.ztree.all.min.js"></script>
    <script type="text/javascript" src="/web-container-base/js/common.js"></script>
    <script type="text/javascript" src="/web-container-base/js/base64.js"></script>
    <script type="text/javascript" src="/web-container-base/js/DocSys.js"></script>
</head>
<body style="height: 100%; margin: 0;">
<div align=center style="margin-top:20px">
    <ul id="zipPlayer" class="ztree" style="margin-bottom: 120px;"></ul>
</div>
<script type="text/javascript">
    var docInfo = getDocInfoFromRequestParamStr();
    var gShareId = docInfo.shareId;

    $(document).ready(function () {
        getAndShowZipInitMenu(docInfo);
    });

    function getAndShowZipInitMenu(docInfo) {
        console.log("getAndShowZipInitMenu docId:" + docInfo.docId + " parentPath:" + docInfo.path + " docName:" + docInfo.name);

        $.ajax({
            url: "/doc/getZipSubDocList",
            type: "post",
            dataType: "json",
            data: {
                docId: docInfo.docId,
                docPath: docInfo.path,
                docName: docInfo.name,
            },
            success: function (ret) {
                if (ret.status) {
                    console.log("getMenu() ret", ret);
                    drawMenu(ret.data);
                } else {
                    showErrorMessage("获取压缩文件列表失败:" + ret.msgInfo);
                }
            },
            error: function () {
                showErrorMessage("获取压缩文件列表失败:服务器异常");
            }
        });
    }

    function reDrawMenu(data) {
        drawMenu(data);
    }

    //绘制zTree with the data:强制绘制，判断的东西不应该放在这里
    function drawMenu(data) {
        console.log("drawMenu");
        window.menu = data;
        var menu = data;
        //遍历jason_arry
        for (var i = 0; i < menu.length; i++) {
            var jsonObj = menu[i];
            jsonObj.id = jsonObj.id;
            jsonObj.pId = jsonObj.pid != 0 ? jsonObj.pid : "root";
            jsonObj.isParent = jsonObj.type == 1 ? false : true;
            jsonObj.Level = jsonObj.level;
            jsonObj.isZip = 1;
            jsonObj.rootPath = docInfo.path;
            jsonObj.rootName = docInfo.name;

            //设置用户自定义文件图标（必须在standardStyle中有定义）
            if (jsonObj.type == 1) {
                var iconType = getDiyFileIconType(jsonObj.name);
                if (iconType && iconType != "") {
                    jsonObj.iconSkin = iconType;
                }
            }
        }
        zTreeInit(menu);
    }

    function zTreeInit(data) {
        console.log("zTreeInit");
        var doctree = $.fn.zTree.init($("#zipPlayer"), setting, data);
    }

    //zTree's setting
    var setting = {
        //可编辑功能设置
        edit: {},
        //zTree数据格式
        data: {
            //使用简单数据模式
            simpleData: {
                enable: true,
            },
            //不允许修改leaf node and parent node的isParent属性
            keep: {
                leaf: true,
                parent: true,
            },
        },
        //设置异步加载的参数
        async: {
            enable: true,//设置 zTree 是否开启异步加载模式
            url: "/doc/getZipSubDocList",
            type: "post",
            autoParam: ["id", "path", "name"],//异步加载时需要自动提交父节点属性的参数
            otherParam: {
                "docPath": docInfo.path, //zipFile的路径
                "docName": docInfo.name, //zipFile的名字
            },
            dataFilter: asyncDataFilter,
        },
        //zTree各种操作的回调函数定义
        callback: {
            beforeAsync: zTreeBeforeAsync, //异步加载前的回调函数， 可以用来判断是否需要异步加载
            onAsyncSuccess: zTreeOnAsyncSuccess, //异步加载完成后的回调
            onClick: zTreeOnClick,
            onDblClick: zTreeOnDbClick,
            beforeRightClick: zTreeBeforeRightClick
            //onRightClick: zTreeOnRightClick, //定义该回调将会屏蔽系统右击事件
        },
        view: {
            //showLine: false,	//不显示文件下面的下划线
            //addDiyDom: addDiyDom         //设置zTree的自定义图标
            addHoverDom: addHoverDom,
            removeHoverDom: removeHoverDom,
        }
    };

    function addHoverDom(treeId, treeNode) {
        var aObj = $("#" + treeNode.tId + "_a");
        if ($("#diyBtn_" + treeNode.id).length > 0) return;
        var editStr = "<span class='caret pull-right' id='diyBtn_" + treeNode.id
            + "' title='" + treeNode.name + "' onfocus='this.blur();'></span>";
        aObj.append(editStr);
        var btn = $("#diyBtn_" + treeNode.id);
        if (btn) btn.bind("click", function () {
            console.log("diyBtn onclick for " + treeNode.name);
        });
    }

    function removeHoverDom(treeId, treeNode) {
        $("#diyBtn_" + treeNode.id).unbind().remove();
    }

    //为了能够让外部接口能够调用zTree的callback，需要记录当前treeNode等变量
    function zTreeOnClick(event, treeId, treeNode) {
        console.log("zTreeOnClick treeId:" + treeId, treeNode);
        //手机端上点击则打开
    }

    //Double Click 对于文件应该是编辑，对于目录应该是打开
    function zTreeOnDbClick(event, treeId, treeNode) {
        console.log("zTreeOnDbClick treeId:" + treeId, treeNode);
        //openDoc(treeNode, false, false, docInfo.shareId);
    }

    //This function was used to get the rightClick treeNode,it will be used for contextjs
    function zTreeBeforeRightClick(treeId, treeNode) {

        curRightClickedTreeNode = treeNode;
        return true;
    };

    function zTreeBeforeAsync(treeId, treeNode) {
        console.log("zTreeBeforeAsync treeId:" + treeId, treeNode);
    }

    function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) {
        console.log("zTreeOnAsyncSuccess treeId:" + treeId);
    }

    function asyncDataFilter(treeId, parentNode, responseData) {
        console.log("asyncDataFilter");
        var docList = responseData.data;
        if (!docList) {
            return docList;
        }
        //遍历jason_arry, convert the node type to isParent flag
        for (var i = 0; i < docList.length; i++) {
            var jsonObj = docList[i];
            jsonObj.id = jsonObj.id;
            jsonObj.docId = jsonObj.id;
            jsonObj.pId = jsonObj.pid != 0 ? jsonObj.pid : "root";
            jsonObj.isParent = jsonObj.type == 1 ? false : true;
            jsonObj.isZip = 1;
            jsonObj.rootPath = docInfo.path;
            jsonObj.rootName = docInfo.name;

            //设置用户自定义文件图标（必须在standardStyle中有定义）
            if (jsonObj.type == 1) {
                var iconType = getDiyFileIconType(jsonObj.name);
                if (iconType && iconType != "") {
                    jsonObj.iconSkin = iconType;
                }
            }
        }
        console.log(docList);
        return docList;
    }
</script>
</body>
</html>